<template>
	<!--pages/agent/list.wxml-->
	<!-- 自然人  法人 -->
	<!-- <button bindtap="showPopup">展示弹出层</button>
 -->

	<view class="main">
		<van-field :fieldValue="fieldValue" is-link readonly label="地区" placeholder="请选择所在地区"
			@click.native="show = true" />
		<van-popup v-model="show" round position="bottom">
			<!-- <van-cascader
    v-model="cascaderValue"
    title="请选择所在地区"
    :options="options"
    @close="show = false"
    @change="onChange"
    @finish="onFinish"
  /> -->
		</van-popup>
		<view class="swiper-tab te_c flex">
			<view class="text-center" :class="'swiper-tab-list flex-1 f26 ' + (currentTab == 0 ? 'on' : '')"
				data-current="0" @click="swichNav">自然人</view>
			<view class="text-center" :class="'swiper-tab-list flex-1 f26 ' + (currentTab == 1 ? 'on' : '')"
				data-current="1" @click="swichNav">法人</view>
		</view>
		<!-- 自然人 -->
		<view  v-if="currentTab==0">
				<view v-for="(item, index) in data"
					:key="item.index" style="padding: 0 20rpx;">
					<uni-transition :duration="item.duration" :mode-class="'slide-right'"  :show="true" >
						<view class="flex flex-pack-justify flex-align-center item Acenter"  >
							<view class="flex-1 flex info flex-align-center Acenter">
								<view class="portrait" v-if="item.avatarimage">
									<image :src="item.avatarimage + ' '" mode="scaleToFill"></image>
								</view>
								<text class="f32">{{ item.name?item.name:'' }}</text>
							</view>
							<view class="te_c flex flex-align-center f24">
								<!-- <view class="link">调研</view> -->
								<view :data-index="index" class="link" @click="urlAccount">记账</view>
								<view @click="makePhoneCallChange" :data-index="index" class="tel">
									<image src="../../static/uview/common/tel-min.png"></image>
								</view>
							</view>
						</view>
					</uni-transition>
				</view>
		</view>
		<!-- 法人 -->
		<view class=""  v-if="currentTab==1">
				<view   v-for="(item, index) in data"
					:key="index"  style="padding: 0 20rpx;">
					<uni-transition :duration="item.duration" :mode-class="'slide-right'"  :show="true" >
						<view  class="flex flex-pack-justify flex-align-center item">
							<view class="flex-1 flex info flex-align-center">
								<view class="portrait" v-if="item.avatarimage">
									<image :src="item.avatarimage + ' '" mode="scaleToFill"></image>
								</view>
								<text class="f32">{{ item.contacts?item.contacts:'' }}</text>
							</view>
							<view class="te_c flex flex-align-center f24">
								<!-- <view class="link">调研</view> -->
								<view class="link" @click="urlFaChange(item)">记账</view>
								<view class="tel" @click="makePhoneCallChangeFa" :data-index="index">
									<image src="../../static/uview/common/tel-min.png">
										</image>
								</view>
							</view>
						</view>
					</uni-transition>
				</view>
		</view>
	</view>
	<!-- <van-popup show="{{isAreaShow}}" position="bottom" custom-style="height: 50%;" bind:close="onCloseAarea">
  区域选择
  <van-area area-list="{{ areaList }}" columns-placeholder="{{ ['请选择', '请选择', '请选择'] }}" columns-num="3" title="选择地址" bind:confirm="getArea" bind:cancel="colseArea" bind:change="showArea" />
</van-popup> -->
</template>

<script>
	// pages/agent/list.js
	var app = getApp();
	export default {
		// components: {
		//     vanButton,
		//     vanPopup,
		//     vanDialog
		// },
		data() {
			return {
				// 区域选择地址数据
				areaList: [],

				// 是否显示区域
				isAreaShow: false,

				winWidth: 0,
				winHeight: 0,
				currentTab: 0,
				currentTabIndex: 1,

				// 自然人法人列表数据
				data: [],

				// 用户信息
				id: '',

				// 查询自然人或法人是否存在记账信息的月份
				month: '',

				show: false,
				token: '',
				fieldValue: '',
				user_type:'',//用户类型
				type_id:'1',//具体业务类型
				urlFaChangeData:'',//保存法人跳转数据
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			let userInfo = uni.getStorageSync('userInfo');
			if (userInfo) {
				this.id = userInfo[0].id
				this.user_type=userInfo.user_type
			}
			var that = this;
			//   uni.getSystemInfo({
			//       success: function (res) {
			// this.winWidth=res.windowWidth,
			// this.winHeight= res.windowHeight + 50
			//       }
			//   });
			var tokens = uni.getStorage({
				key: 'token'
			});
			this.id = options.id,
			this.token = tokens // 获取法人自然人列表数据
			this.getLiaisonRelationshipData();
		},
		methods: {
			// 区域选择确定
			getArea: function() {},

			// 区域选择取消
			colseArea: function() {},

			// 区域选择改变
			showArea: function() {},

			// 区域弹窗关闭
			
			onCloseAarea: function() {},

			// 导航栏切换事件
			swichNav: function(e) {
				var that = this;
				this.currentTab = e.target.dataset.current
				if (e.target.dataset.current == 0) {
					this.currentTabIndex = 1
				} else {
					this.currentTabIndex = 2
				}
				that.data=[]
				this.getLiaisonRelationshipData();
			},

			bindChange: function(e) {
				var that = this;
				this.currentTab = e.detail.current
			},

			// 自然人  法人查询是否记账记录请求
			submitRequest: function(id, month, user_type, url,item) {
				console.log('获取自然人  法人查询是否记账记录请求自然人  法人查询是否记账记录请求',id, month, user_type, url,item)
				var that = this
				uni.request({
					method: 'POST',
					url: 'https://jizhang.xqyu.cn/index.php/api/index/get_liaison_index',
					dataType: 'json',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						uid: id,
						user_type: user_type,
						month: month
					},
					success: function(res) {
						console.log('获取// 自然人  法人查询是否记账记录请求',res)
						if (res.data.code == 1) {
							if (res.data.data == null) {
								// 没有记账记录 执行跳转逻辑
								if(user_type==1){//如果电机的额是自然人tab
									let item={
										id:id,
										user_type:user_type,
										type:'联络人'
									}
									uni.navigateTo({
										url:"../componentsA/parse/index?item="+JSON.stringify(item)
									})
								}else {//如果点击的额是法人tab
								    console.log('获取法人应该跳转哪个页面that.urlFaChangeData.business_specific_type',that.urlFaChangeData.business_specific_type)
									var myDate = new Date();//获取系统当前时间
									var  year=myDate.getFullYear()
									var  month=myDate.getMonth()+1
									let obj={
										clickType:'联络人',
										id:id,
										year:year,
										month:month,
										business_specific_type:item.business_specific_type,
										jizhang_score:item.jizhang_score,
										user_type:user_type
									}
									if(that.urlFaChangeData.business_specific_type==1 || that.urlFaChangeData.business_specific_type==2  || that.urlFaChangeData.business_specific_type==3){
										uni.navigateTo({
											url: "../template/hotel/index?item="+JSON.stringify(obj)
										})//酒店记账跳转
									}else if(that.urlFaChangeData.business_specific_type==4 || that.urlFaChangeData.business_specific_type==5 || that.urlFaChangeData.business_specific_type==6){//景区记账
										uni.navigateTo({
											url: "../template/parkLand/index?item="+JSON.stringify(obj)
										})
									}else if(that.urlFaChangeData.business_specific_type==7 ||that.urlFaChangeData.business_specific_type==8){
										uni.navigateTo({
												url: "../template/travel/index?item="+JSON.stringify(obj)
										})//旅行社记账跳转
									}else if(that.urlFaChangeData.business_specific_type==9 || that.urlFaChangeData.business_specific_type==10  || that.urlFaChangeData.business_specific_type==11 || that.urlFaChangeData.business_specific_type==12){
										uni.navigateTo({
											url: "../library/debounce/index?item="+JSON.stringify(obj)
										})
									}else if(that.urlFaChangeData.business_specific_type==13){
										uni.navigateTo({
											url: "../library/deepClone/index?item="+JSON.stringify(obj)
										})
									}else if(that.urlFaChangeData.business_specific_type==14){
										uni.navigateTo({
											url: "../template/countrySmile/countrySmile?item="+JSON.stringify(obj)
										})
									}else if(that.urlFaChangeData.business_specific_type==15){
										uni.navigateTo({
											url: "../template/country/index?item="+JSON.stringify(obj)
										})
									}else{
										that.$.toast('暂未开通记账功能,请联系管理员')
									}
								}
							} 
						}
					}
				});
			},

			// 自然人记账跳转
			urlAccount: function(e) {
				// 获取当前点击记账的列表数据下标
				let index = e.currentTarget.dataset.index;
				let id = this.data[index].id; // 获取当前月份
				let d = new Date();
				let month = d.getMonth();
				if (month < 10) {
					this.month = '0' + month
				} else {
					this.month = month
				} 
				// 调取接口查询是否存在记账行为  执行跳转逻辑 跳转自然人记账

				let url = '../componentsA/parse/index?id='
				this.submitRequest(id, this.month, '1', url,e)
			},
			// 法人记账跳转
			urlFaChange: function(item) {
				console.log('法人记账跳转了',item)
				this.urlFaChangeData=item
				console.log('法人ethis.urlFaChangeData',this.urlFaChangeData)
				let id = item.id; // 获取当前月份
				let d = new Date();
				let month = d.getMonth();
				if (month < 10) {
					this.month = '0' + month
				} else {
					this.month = month
				} // 调取接口查询是否存在记账行为  执行跳转逻辑  跳转法人记账逻辑
				let url = '../componentsC/actionSheet/index?id=';
				this.submitRequest(id, this.month, '2', url,item);
			},
			

			// 自然人电话事件
			makePhoneCallChange: function(e) {
				let index = e.currentTarget.dataset.index;
				var phone = this.data[index].phone; // 拨打电话
				uni.makePhoneCall({
					phoneNumber: phone
				});
			},

			// 法人电话事件
			makePhoneCallChangeFa: function(e) {
				let index = e.currentTarget.dataset.index;
				var phone = this.data[index].phone; // 拨打电话
				uni.makePhoneCall({
					phoneNumber: phone
				});
			},

			// 获取法人  自然人列表数据
			getLiaisonRelationshipData() {
				var _self = this;
				let userInfo = uni.getStorageSync('userInfo');
				var id2 =userInfo[0].id;
				console.log("id2",id2);
				this.$.tipLoading('加载中')
				uni.request({
					method: 'POST',
					url: 'https://jizhang.xqyu.cn/index.php/api/index/liaison_relationship',
					dataType: 'json',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						id: id2,
						type: _self.currentTabIndex
					},
					success: function(res) {
						console.log('获取法人自然人列表数据获取法人自然人列表数据获取法人自然人列表数据', res.data.data)
						if (res.data.code == 1) {
							let duration=1000
							for(var i=0;i<res.data.data.length;i++){
								duration+=200
								res.data.data[i].duration=duration
							}
							console.log('循环',res.data.data)
							_self.data = res.data.data
							_self.$.hideLoading()
							
						} else {
							_self.$.hideLoading()
							_self.$.toast(res.data.msg);
						}
					},
					fail() {
						_self.$.hideLoading()
						_self.$.toast(res.data.msg);
					}
				});
			}
		}
	};
</script>
<style lang="scss" scoped>
	.swiper-tab {
		height: 7vh;
		display: flex;
		line-height: 7vh;
		background-color: #f7f7f7;
	}

	.swiper-tab-list {
		color: #777777;
	}

	.on {
		color: white;
		background-color: #029ee9;
	}

	.swiper-box {
		display: block;
		height: calc(93vh - 40rpx);
		width: calc(100% - 40rpx);
		overflow: scroll;
		padding: 20rpx;
	}

	.item {
		margin-top: 20rpx;
		border-bottom: 1px #e5e5e5 solid;
		padding: 20rpx 0;
	}

	.item .portrait {
		width: 105rpx;
		height: 105rpx;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 20rpx;
	}

	.item .portrait image {
		width: 105rpx;
		height: 105rpx;
	}

	.item .link {
		border: 1px #02a8f5 solid;
		color: #02a8f5;
		height: 60rpx;
		margin-right: 20rpx;
		line-height: 60rpx;
		padding: 0 20rpx;
		border-radius: 30rpx;
	}

	.item .tel image {
		width: 48rpx;
		height: 48rpx;
	}
</style>
